#{extends 'main.html' /} #{set title:'TagView' /}
<head>
<!-- JAVA SCRIPT PARTIOTION START-->
<!--------------------------------->
<!-- ON PAGE LOADING HIDE ALL !! -->
<script type="text/javascript">
	$(function() {
		$('#organizationDiv').hide();
		$('#actionItemDiv').hide();
		$('#topicDiv').hide();
		$('#ideaDiv').hide();
		javascript: showOrganizationsJoined();
		javascript: showOrganizationsFollowed();
		javascript: showOrganizationsManaged();
		$('#joinedOrgsDiv').hide();
		$('#managedOrgsDiv').hide();
		$('#followedOrgsDiv').hide();
		javascript: loadIdeas();
		javascript: loadTopics();
		javascript: loadActionItems();
	
	});
</script>
<script type="application/javascript"> 
	
	function loadIdeas(){
		$.getJSON('@{TagPage.loadTagIdeas()}',
{'tagId':document.getElementById("hiddenTagId").value}
,function(data){
			document.getElementById("ideaDiv").innerHTML = data.result;
		});
	}
function loadTopics(){
		$.getJSON('@{TagPage.loadTagTopics()}',
{'tagId':document.getElementById("hiddenTagId").value}
,function(data){
			document.getElementById("topicDiv").innerHTML = data.result;
		});
	}
function loadActionItems(){
		$.getJSON('@{TagPage.loadTagActionItems()}',
{'tagId':document.getElementById("hiddenTagId").value}
,function(data){
		
			document.getElementById("actionItemDiv").innerHTML = data.result;
		});
	}
</script>
<!-- ON PAGE LOADING HIDE ALL !! -->
<!--------------------------------->
<!----- Show / Hide divisions ----->
<script type="text/javascript">
	function showThisAndHideAll(divisionToShow) {
		if (divisionToShow == '') {
			$('#actionItemDiv').slideUp();
			$('#topicDiv').slideUp();
			$('#ideaDiv').slideUp();
		} else {
			$('#organizationDiv').hide();
			$('#actionItemDiv').hide();
			$('#topicDiv').hide();
			$('#ideaDiv').hide();
			$('#' + divisionToShow + 'Div').slideDown(1000);
		}
	}
</script>
<!----- Show / Hide divisions ----->
<script type="text/javascript">
	function showThisAndHideAllOrg(divisionToShow) {
		$('#joinedOrgsDiv').hide();
		$('#managedOrgsDiv').hide();
		$('#followedOrgsDiv').hide();
		$('#' + divisionToShow + 'Div').slideDown(1000);

	}
</script>
<!--------------------------------->
<!----- Show / Hide hyper Links --->
<script type="text/javascript">
	function changeLabelAndHyperLinks(division, link) {
		if (division == "organization") {
			if (link == "joinedOrganizations") {
			} else if (link == "managedOrganizations") {
			} else if (link == "myOrganizations") {
				javascript: showOrganizationsFollowed();
			}
		}
		if (division == "actionItem") {
		}
		if (division == "topic") {
		}
		if (division == "idea") {
		}
	}
</script>
<!----- Show / Hide hyper Links --->
<!--------------------------------->

<script type="text/javascript">
	function showOrganizationsJoined() {
		var user = '${user}';
	
		$
				.getJSON(
						'@{BrowseController.browseOrganizationsJoined()}',
						{
							'userName' : user
						},
						function(data) {
							var orgs = data.joinedOrgs;
							var orgsPart = "";

							if (orgs == null || orgs == "") {
								document.getElementById("joinedOrgsDiv").innerHTML = "No organizations to show";
							} else {
								orgsPart = "";
								var x = orgs.split("&&");
								for ( var i = 0; i < x.length; i = i + 1) {
									//orgsPart +=	"<tr> <td><a href = '#' onclick = \"showOrganization('" + "" + user + "','" + x[i] +"')\">" +   "open"+  "</a>";	
									orgsPart += "<tr> <td> <a href = '#' onclick = \"getInsideOrg('"
											+ ""
											+ user
											+ "','"
											+ x[i]
											+ "')\">"
											+ x[i]
											+ "</a></tr></td></br>";
									//orgsPart += "<div id = \"org	" + x[i] + "\"></div></td><td>" + "votes" + "</td></tr>";
								}
								document.getElementById("joinedOrgsDiv").innerHTML = orgsPart;
							}
						});
	}
</script>

<script type="text/javascript">
	function showOrganizationsManaged() {
		var user = '${user}';
		$
				.getJSON(
						'@{BrowseController.browseOrganizationsManaged()}',
						{
							'userName' : user
						},
						function(data) {
							var orgs = data.managedOrgs;
							var orgsPart = "";
							if (orgs == null || orgs == "") {
								document.getElementById("managedOrgsDiv").innerHTML = "No organizations to show";
							} else {
								orgsPart = "";
								var x = orgs.split("&&");
								for ( var i = 0; i < x.length; i = i + 1) {
									//orgsPart +=	"<tr> <td><a href = '#' onclick = \"showOrganization('" + "" + user + "','" + x[i] +"')\">" +   "open"+  "</a>";	
									orgsPart += "<tr> <td> <a href = '#' onclick = \"getInsideOrg('"
											+ ""
											+ user
											+ "','"
											+ x[i]
											+ "')\">"
											+ x[i]
											+ "</a></tr></td></br>";
									//orgsPart += "<div id = \"org" + x[i] + "\"></div></td><td>" + "votes" + "</td></tr>";
								}
								document.getElementById("managedOrgsDiv").innerHTML = orgsPart;
							}
						});
	}
</script>

<script type="text/javascript">
	function showOrganizationsFollowed() {
		var user = '${user}';
		$
				.getJSON(
						'@{BrowseController.browseOrganizationsFollowed()}',
						{
							'userName' : user
						},
						function(data) {
							var orgs = data.followedOrgs;
							var orgsPart = "";
							if (orgs == null || orgs == "") {
								document.getElementById("followedOrgsDiv").innerHTML = "No organizations to show";
							} else {
								orgsPart = "";
								var x = orgs.split("&&");
								for ( var i = 0; i < x.length; i = i + 1) {
									//orgsPart +=	"<tr> <td><a href = '#' onclick = \"showOrganization('" + "" + user + "','" + x[i] +"')\">" +   "open"+  "</a>";	
									orgsPart += "<tr> <td> <a href = '#' onclick = \"getInsideOrg('"
											+ ""
											+ user
											+ "','"
											+ x[i]
											+ "')\">"
											+ x[i]
											+ "</a></tr></td></br>";
									//orgsPart += "<div id = \"org" + x[i] + "\"></div></td><td>" + "votes" + "</td></tr>";
								}
								document.getElementById("followedOrgsDiv").innerHTML = orgsPart;
							}
						});
	}
</script>

<script type="text/javascript">
	$(document)
			.ready(
					function display2() {

						$
								.getJSON(
										'@{TagPage.canFollowTag()}',
										{
											'tagId' : document
													.getElementById("hiddenTagId").value
										},
										function(data) {

											if (data.followTag == "you are already a follower") {
												document
														.getElementById('follow').style.visibility = 'hidden';
												document
														.getElementById('unfollow').style.visibility = 'visible';
											} else {
												document
														.getElementById('unfollow').style.visibility = 'hidden';
												document
														.getElementById('follow').style.visibility = 'visible';
											}
										});
					});
</script>

<script type="text/javascript">
	function followTag() {

		$.getJSON('@{TagPage.followTag()}', {
			'tagId' : document.getElementById("hiddenTagId").value
		}, function(data) {
			document.getElementById('follow').style.visibility = 'hidden';
			document.getElementById('unfollow').style.visibility = 'visible';
		});
	}
</script>

<script type="text/javascript">
	function unfollowTag() {

		$.getJSON('@{TagPage.unfollowTag()}', {
			'tagId' : document.getElementById("hiddenTagId").value
		}, function(data) {
			document.getElementById('follow').style.visibility = 'visible';
			document.getElementById('unfollow').style.visibility = 'hidden';
		});
	}
</script>

</head>

<body>
	<div id="content">
		<h3>${thisTagName}</h3>

		<div id="creatorDiv"></div>
		<table width="200" border="1">
			<tr>
				<th scope="col"><input type="button" id="topicBtn"
					value="    Topics    " onclick="showThisAndHideAll('topic')">
				</th>
				<th scope="col"><input type="button" id="ideaBtn"
					value="    Ideas     " onclick="showThisAndHideAll('idea')">
				</th>
				<th scope="col"><input type="button" id="actionItemBtn"
					value=" Action Items " onclick="showThisAndHideAll('actionItem')">
				</th>
				<th scope="col"><input type="button" id="hideAll"
					value="   Hide All   " onclick="showThisAndHideAll('')">
				</th>
			</tr>
		</table>

		<!---------------------------------------------------------->
		<!--   ACTION ITEM ACTION ITEM ACTION ITEM ACTION ITEM    -->
		<div id="actionItemDiv"></div>
		<!--   ACTION ITEM ACTION ITEM ACTION ITEM ACTION ITEM     -->
		<!----------------------------------------------------------->
		<!--TOPICS TOPICS TOPICS TOPICS TOPICS TOPICS TOPICS TOPICS-->
		<div id="topicDiv"></div>
		<!--TOPICS TOPICS TOPICS TOPICS TOPICS TOPICS TOPICS TOPICS-->
		<!----------------------------------------------------------->
		<!--  IDEA IDEA IDEA IDEA IDEA IDEA IDEA IDEA IDEA IDEA    -->
		<div id="ideaDiv"></div>
		<!--  IDEA IDEA IDEA IDEA IDEA IDEA IDEA IDEA IDEA IDEA   -->
		<!---------------------------------------------------------->
		<p>&nbsp;</p>
		<input type="hidden" id="hiddenTagId" value="${thisTagId}"> <input
			type="hidden" id="hiddenCreator" value="${creator}">
	</div>
	<div id="sidebar">
			<form>
				<input id="follow" class="formbutton" type="button" onclick="followTag()"
					value="Follow" name="FollowButton" style="background-color:green;">
				<input id="unfollow" class="formbutton" type="button" onclick="unfollowTag()"
					value="Unfollow" name="UnfollowButton">
			</form>
		</div>
</body>
